<template>
	<div class="allcontainer" v-loading="loading">
		<div class="h2">我管理的学生组织</div>
		<div class="bg-white">
			<div class="table">
				<el-table stripe ref="singleTable" :data="MClubList" highlight-current-row style="width: 100%">
					<el-table-column type="index" label="序号" width="60" fixed="left" align="center"></el-table-column>
					<el-table-column prop="Name" label="名称" min-width="100" fixed="left"></el-table-column>
					<!-- <el-table-column prop="PorjectName" label="项目" min-width="100"></el-table-column> -->
					<el-table-column prop="TypeName" label="类型" min-width="100" align="center"></el-table-column>
					<el-table-column prop="DpeartName" label="学院" min-width="120" align="center"></el-table-column>
					<el-table-column prop="IsEnable" label="操作" width="260">
						<template slot-scope="scope">
							<div class="user-btn user-btn-long">
								<span class="member" @click="membermanage(scope.row)">成员管理</span>
								<span class="applicant" @click="applicant(scope.row)">申请人</span>
								
								<a-dropdown>
									<a style="color: #4169E0;padding-left: 10px;" class="ant-dropdown-link"
										@click.prevent>
										更多<i
											style="font-size: 25px;position: relative;top:12px;left:5px !important;font-style: normal;">ˇ</i>
									</a>
									<template #overlay>
										<a-menu>
											<a-menu-item @click="Notice(scope.row,'NoticeJoin')">
												公告
											</a-menu-item>
											<a-menu-item @click="Notice(scope.row,'MoreJoinManageClub')">
												申请加入
											</a-menu-item>
											<a-menu-item v-if="scope.row.ChairmanNo==UserInfo.UserNo" @click="Notice(scope.row,'UserClubAnnualAudit')">
												年审管理
											</a-menu-item>
											<a-menu-item @click="chakan(scope.row)">
												二维码
											</a-menu-item>
											<!-- <a-menu-item @click="Notice(scope.row,'SetMoreManageClub')">
												配置列表
											</a-menu-item> -->
										</a-menu>
									</template>
								</a-dropdown>
							</div>
							<!-- <oprateBtn title="活动管理" icon="icon-huodong" color="blue" @tap="activitymanage(scope.row)"></oprateBtn> -->
						</template>
					</el-table-column>
				</el-table>
			</div>
			
			<a-modal v-model:visible="visible" title="组织二维码" @ok="handleOk">
				<div style="display: flex;flex-direction: column;align-items: center; justify-content: center;">
					<img :src="yuyueSrc" style="width: 200px;height: 200px;margin: 0 auto;" />
					 <a-button type="primary" size="small" @click="down(yuyueSrc)" style="margin-top: 10px;">
					    <template #icon>
					      <DownloadOutlined />
					    </template>
					    下载二维码
					  </a-button>
				</div>
				
			</a-modal>
		</div>
	</div>
</template>

<script>
	import {
		GetUserManagClubList,
		UserClubClubQRImage
	} from '@/api/follow';
	import Cache from '@/utils/cache';
	export default {
		data() {
			return {
				MClubList: [],
				requestUrl:this.global.requestUrl,
				UserInfo: Cache.get('myInfo'),
				showModal: false,
				loading: false,
				yuyueSrc:'',
				visible:false,
				pagination: {
					currentPage: 1,
					pageSize: this.global.pageSize,
					pageSizeOptions: this.global.pageSizeOptions, // 每页中显示的数据
					showTotal: total => `共有 ${total} 条数据` // 分页中显示总的数据
				}
			};
		},
		created() {
			this.getList();
		},
		computed: {},
		methods: {
			down(src){
				 let url = src
				     fetch(url).then(res => res.blob()).then(blob => { // 将链接地址字符内容转变成blob地址
				       const aLink = document.createElement('a')
				       aLink.href = URL.createObjectURL(blob)
				       // 文件名字
				       aLink.download = Date.now() + ".jpg"
				       document.body.appendChild(aLink)
				       aLink.click()
				       aLink.remove();
				     })
			},
			Notice(text,name) {
				this.$router.push({
					name: name,
					query: {
						Name: text.Name,
						ID: text.ID,
						ChairmanNo: text.ChargeUserNo
					}
				});
			},
			async chakan(text) {
				let data = {}
				data.id = text.ID
				data.headTicket = Cache.get('token')
				// data.userToken = encodeURIComponent(this.token)
				// let res = await UserClubClubQRImage(data)
				// console.log(res)
				// this.yuyueSr=await UserClubClubQRImage(data)
				let hrefUrl = this.requestUrl + 'User/Club/ClubQRImage?id=' + text.ID+'&headTicket='+data.headTicket
				console.log(hrefUrl);
				this.yuyueSrc=hrefUrl
				// this.yuyueSrc='data:image/png;base64,' + btoa(
				// 	new Uint8Array(res.data)
				// 	.reduce((data, byte) => data + String.fromCharCode(byte), '')
				// );
				this.visible = true
			},
			handleOk() {
				this.visible = false;
			},
			membermanage(text) {
				this.$router.push({
					name: 'Membermanage',
					query: {
						ID: text.ID,
						ChairmanNo: text.ChairmanNo
					}
				});
			},
			applicant(text) {
				this.$router.push({
					name: 'ApplyList',
					query: {
						ID: text.ID
					}
				});
			},
			handleSizeChange(val) {
				this.pagination.pageSize = val;
				this.getList();
			},
			handleCurrentChange(val) {
				this.pagination.currentPage = val;
				this.getList();
			},
			async getList() {
				let data = {};
				this.loading = true;
				let res1 = await GetUserManagClubList(data);
				this.MClubList = res1.data.data;
				this.loading = false;
			},
			closeFun(index) {
				this.showModal = false;
				if (index === 1) {
					this.showModal != this.showModal;
					this.getList();
				}
			},
		}
	};
</script>
<style scoped>
/deep/.ant-modal-body{
		text-align: center;
	}
</style>

